<template>
  <div class="app-container">
    <el-row>
      <el-col :span="20">
        <a-title></a-title>
      </el-col>
      <el-col :span="4" style="text-align: right;">
        <el-button type="primary" @click="onSubmit">保 存</el-button>
      </el-col>
    </el-row>

    <el-form ref="form" label-width="150" :inline="true" :model="form">
      <el-row>
        <el-col :span="6">
          <el-form-item label="项目名称">
            <el-tooltip placement="top" trigger="hover">
              <div slot="content">
                <pre>{{form.projectName }}</pre>
              </div>
              <el-input disabled v-model="form.projectName"></el-input>
            </el-tooltip>
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="项目类型">
            <el-input clearable v-model="form.projectType"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="项目总投资(万元)">
            <el-input clearable v-model="form.totalInvestment" type="number"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="合作期限(年)">
            <el-input clearable v-model="form.cooperationTerm" type="number"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="6">
          <el-form-item label="建设类型(新建\改扩建)">
            <el-select disabled v-model="form.construcType">
              <el-option label="新建" value="0" />
              <el-option label="改扩建" value="1" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="运作方式">
            <el-input clearable v-model="form.operationMode"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="回报机制">
            <el-input clearable v-model="form.rewardSystem"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="合作范围">
            <el-input clearable v-model="form.cooperationScope"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="6">
          <el-form-item label="所属行业">
            <el-tooltip placement="top" trigger="hover">
              <div slot="content">
                <pre>{{form.industry }}</pre>
              </div>
              <el-input disabled v-model="form.industry"></el-input>
            </el-tooltip>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="计划开发年度">
            <el-input clearable v-model="form.planDevelopYear" type="number"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="项目用地总面积(平方米)">
            <el-input clearable v-model="form.projectUseArea" type="number"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="项目概括">
            <el-input clearable v-model="form.projectGeneralize"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="6">
          <el-form-item label="发起时间">
            <el-date-picker
              v-model="form.startTime"
              type="date"
              range-separator="-"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="发起类型">
            <el-input clearable v-model="form.startType"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="发起人名称">
            <el-input clearable v-model="form.startPersonName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="采购社会资本方式的选择">
            <el-input clearable v-model="form.purchaseMode"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="财政联系人及联系方式">
            <el-input clearable v-model="form.financeLinkmanAndMode"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="项目联系人及联系方式">
            <el-input clearable v-model="form.projectLinkmanAndMode"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="实施机构">
            <el-input clearable v-model="form.enforcementBody"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="实施机构联系人及联系方式">
            <el-input clearable v-model="form.enforcementLinkmanAndMode"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col class="el-col-title" :span="24">
          <div class="grid-content bg-purple-light">物有所值评价</div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="PSC值">
            <el-input clearable v-model="form.pscValue"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="PPPs值">
            <el-input clearable v-model="form.pppsValue"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="物有所值指数">
            <el-input clearable v-model="form.priceToValueIndex"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="是否物有所值">
            <el-radio-group v-model="form.isPriceToValue">
              <el-radio
                v-for="item in whetherOptions"
                :key="item.value"
                :label="item.label"
              >{{item.label}}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col class="el-col-title" :span="24">
          <div class="grid-content bg-purple-light">财政承受能力论证</div>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="地方政府一般公共预算支出年平均增长率">
            <el-input clearable v-model="form.growthRate"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目财政支出责任占本区一般公共预算支出基数最高比例">
            <el-input clearable v-model="form.tallest"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="是否通过财政承受能力论证">
            <el-radio-group v-model="form.isFiscalCapacity">
              <el-radio
                v-for="item in whetherOptions"
                :key="item.value"
                :label="item.label"
              >{{item.label}}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
import {
  getIndicatorReport,
  addIndicatorReport,
  updateIndicatorReport
} from "@/api/business/indicatorReport";
import { listGeneral } from "@/api/projectWorkbench/projectList/projectGeneral";
import aTitle from "@/components/Title";
export default {
  name: "IndicatorReport",
  components: { aTitle },
  data () {
    return {
      form: {
        pscValue: "",
        isFiscalCapacity: "",
        tallest: "",
        growthRate: "",
        priceToValueIndex: "",
        isPriceToValue: "",
        pppsValue: "",
        projectName: "",
        projectType: "",
        cooperationTerm: "",
        enforcementBody: "",
        industry: "",
        startPersonName: "",
        purchaseMode: "",
        financeLinkmanAndMode: "",
        enforcementLinkmanAndMode: "",
        projectLinkmanAndMode: "",
        startType: "",
        startTime: "",
        operationMode: "",
        cooperationScope: "",
        projectGeneralize: "",
        planDevelopYear: "",
        rewardSystem: "",
        projectUseArea: "",
        totalInvestment: "",
        construcType: ""
      },
      queryParams: {},
      whetherOptions: [
        {
          label: "是",
          value: "1"
        },
        {
          label: "否",
          value: "0"
        }
      ]
    };
  },
  created () {
    this.getProjectInfo(this.$route.params.projectId);
  },
  methods: {
    getProjectInfo (projectId) {
      listGeneral(projectId).then(res => {
        if (res.code === 200) {
          //项目名称
          this.form.projectName = res.data.name;
          //所属行业
          this.form.industry = res.data.industry;
          //建设类型
          this.form.construcType = res.data.constructionType;

          this.selectIndicatorReport(this.$route.params.id);
        }
      });
    },
    selectIndicatorReport (businessId) {
      getIndicatorReport({ businessId: businessId }).then(response => {
        if (response.code === 200) {
          if (response.data) {
            this.queryParams = response.data;
            this.form = JSON.parse(response.data.indicatorData);
          }
        } else {
          this.msgError(response.msg);
        }
      });
    },
    onSubmit () {
      this.$refs["form"].validate(valid => {
        if (valid) {
          this.queryParams.indicatorData = JSON.stringify(this.form);
          if (this.queryParams && this.queryParams.guid) {
            updateIndicatorReport(this.queryParams).then(response => {
              if (response.code === 200) {
                this.msgSuccess("修改成功");
              } else {
                this.msgError(response.msg);
              }
            });
          } else {
            var params = {
              projectId: this.$route.params.projectId,
              businessId: this.$route.params.id,
              businessTypeId: this.$route.params.businessCategoryId,
              indicatorData: JSON.stringify(this.form)
            };

            addIndicatorReport(params).then(response => {
              if (response.code === 200) {
                this.queryParams.guid = response.data.guid;
                this.msgSuccess("新增成功");
              } else {
                this.msgError(response.msg);
              }
            });
          }
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.el-col-title {
  border-radius: 4px;
  margin-bottom: 10px;
}
.bg-purple-light {
  background: #e5e9f2;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
  line-height: 36px;
  padding-left: 8px;
}
</style>